* {
	margin: 0;
	padding: 0;
}
ul {
	margin-bottom: 0;
}
#login {
	span {
		color: blue;
		cursor: pointer;
		display: inline-block;
		margin-left: 20px;
		height: 45px;
		line-height: 45px;
		font-size: 12px;
	}
}
#regist {
	span {
		color: #b2b2b2;
		cursor: pointer;
		display: inline-block;
		margin-left: 20px;
		height: 45px;
		line-height: 45px;
		font-size: 12px;
	}
	span:hover {
		color: cyan;
	}
}
html,
body {
	width: 100%;
	height: 100%;
}
.contenier {
	width: 1200px;
	margin: 0 auto;
}
ul > li {
	list-style: none;
}
a {
	text-decoration: none;
}
.top {
	width: 100%;
	> img {
		width: 100%;
		height: 120px;
		position: static;
	}
	.nav {
		height: 45px;
		background-color: #444444;
		a {
			display: inline-block;
			height: 45px;
			line-height: 45px;
			font-size: 12px;
			color: #b2b2b2;
		}
		.contenier {
			:first-child {
				margin-right: 15px;
				display: flex;
				float: left;
				align-items: center;
			}
			:last-child {
				a:hover {
					color: #fff;
				}
				display: flex;
				float: right;
				margin-left: 15px;
				align-items: center;
			}
		}
	}
	.dhl {
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.281);
		position: relative;
		z-index: 999;
		width: 100%;
		height: 74px;
		.contenier {
			line-height: 84px;
			height: 100%;
			> a {
				float: left;
				width: 170px;
				margin-right: 20px;
				img {
					width: 170px;
					height: 28px;
				}
			}
			ul {
				margin-bottom: 0;
				float: left;
				height: 100%;
				li {
					float: left;
					margin-right: 25px;
					height: 100%;
					a {
						display: inline-block;
						color: black;
						text-decoration: none;
						font-size: 18px;
						line-height: 84px;
						height: 100%;
					}
				}
			}
		}
	}
}
.detal {
	.enlarge {
		display: none;
		position: absolute;
		right: -630px;
		top: 0;
		width: 600px;
		height: 600px;
		overflow: hidden;
		border: 1px solid #ccc;
		z-index: 9;
		img {
			position: absolute;
			background-color: #f5f5f5;
			top: 0;
			left: 0;
			width: 1200px;
			height: 1200px;
		}
	}
	padding-bottom: 40px;
	margin-top: 20px;
	width: 100%;
	.contenier {
		// background-color: pink;
		.box {
			display: flex;
		}
		.left {
			#box {
				position: relative;
			}
			.show {
				position: relative;
				height: 550px;
				// background-color: pink;
				width: 100%;
				margin-bottom: 12px;
				img {
					width: 100%;
					height: 100%;
				}
				.mask {
					display: none;
					position: absolute;
					top: 0;
					background-color: #f5f5f5a6;
					width: 50%;
					height: 50%;
				}
			}
			.dw {
				width: 472px;
				margin: 0 auto;
				position: relative;
			}
			//   background-color: pink;
			width: 550px;
			margin-right: 64px;
			clear: left;
			.swiper-container {
				--swiper-navigation-color: #black; /* 单独设置按钮颜色 */
				--swiper-navigation-size: 14px; /* 设置按钮大小 */
				.pre {
					position: absolute;
					left: -20px;
					z-index: 99;
				}
				.nex {
					position: absolute;
					right: -20px;
					z-index: 99;
				}
				overflow: hidden;
				width: 472px;
				height: 86px;

				.swiper-slide {
					.active {
						border: 1px solid #00aaa6;
					}
					cursor: pointer;
					img {
						height: 100%;
						border: 1px solid #dcdcdc;
					}

					height: 100%;

					box-sizing: border-box;
				}
			}
		}
		.right {
			flex: 1;
			.h2 {
				font-size: 20px;
				line-height: 26px;
			}
			.jg {
				padding: 0 20px;
				height: 80px;
				background-color: #f7f7f7;
				margin-top: 20px;
				display: flex;
				justify-content: space-between;
				align-items: center;
				span {
					font-size: 12px;
				}
				:first-child {
					text-align: center;
					color: red;
					font-size: 14px;
					b {
						font-size: 28px;
					}
					span {
						font-size: 10px;
						color: black;
					}
				}
			}
			.dq {
				@extend .jg;
			}
			.cn {
				height: 50px;
				border-bottom: 1px solid #dcdcdc;
				display: flex;
				align-items: center;
				font-size: 14px;
				span {
					margin-right: 20px;
				}
				> div {
					cursor: pointer;
					flex: 1;

					span {
						font-size: 12px;
						img {
							width: 22px;
							height: 22px;
						}
						float: left;
					}
					:last-child {
						margin-right: 0;
						float: right;
					}
				}
			}
			p {
				color: #ccc;
				font-size: 14px;
				margin-top: 20px;
				height: 14px;
			}
			.btn-group {
				margin-bottom: 32px;
				height: 40px;
				width: 136px;
				button {
					width: 34px;
					outline: none;
				}
				input {
					width: 64px;
					outline: none;
				}
			}
			.buy {
				display: inline-block;
				width: 180px;
				height: 40px;
				background-color: red;
				color: #fff;
				font-size: 16px;
				text-align: center;
				line-height: 40px;
				cursor: pointer;
			}
			.car {
				@extend .buy;
				background-color: black;
			}
		}
	}
}
.tpxq {
	background-color: #f7f7f7;
	padding-top: 48px;
	.contenier {
		.conten {
			text-align: center;
		}
		background-color: #fff;
		// height: 40px;
		> p {
			height: 64px;
			font-size: 16px;
			span {
				height: 100%;
				line-height: 64px;
				display: inline-block;
				cursor: pointer;
				padding: 0 16px;
				color: #ccc;
			}
			.black {
				color: black;
			}
		}
	}
}
.xqdhl {
	z-index: 10;
	width: 100%;
	background-color: #fff;
	position: relative;
	display: none;
	.contenier {
		height: 64px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		> p {
			height: 64px;
			font-size: 16px;
			span {
				height: 100%;
				line-height: 64px;
				display: inline-block;
				cursor: pointer;
				padding: 0 16px;
				color: #ccc;
			}
			.black {
				color: black;
			}
		}
		> span {
			display: inline-block;
			width: 82px;
			height: 40px;
			background-color: red;
			color: #fff;
			font-size: 12px;
			text-align: center;
			line-height: 40px;
			cursor: pointer;
		}
	}
}
